<!DOCTYPE HTML>

<html lang="en-US">
	<head>
		<meta charset="UTF-8"/>
		<meta name="viewport" content="width=device-width, initial-scale=1.0" />
		<title> List contact </title>

		<link href="http://fonts.googleapis.com/css?family=Oswald|Droid+Sans:400,700" rel="stylesheet" />
		<!-- The Main CSS File -->
		<link rel="stylesheet" href="../CSS/style.css" />

		<link rel="stylesheet" href="../CSS/site.css" />
		<!-- jQuery -->
		<script src="../Javascript/jQuery/jquery-1.7.2.min.js"></script>
		<!-- Flot -->
		<script src="../Javascript/Flot/jquery.flot.js"></script>
		<script src="../Javascript/Flot/jquery.flot.resize.js"></script>
		<script src="../Javascript/Flot/jquery.flot.pie.js"></script>
		<!-- DataTables -->
		<script src="../Javascript/DataTables/jquery.dataTables.min.js"></script>
		<!-- ColResizable -->
		<script src="../Javascript/ColResizable/colResizable-1.3.js"></script>
		<!-- jQuryUI -->
		<script src="../Javascript/jQueryUI/jquery-ui-1.8.21.min.js"></script>
		<!-- Uniform -->
		<script src="../Javascript/Uniform/jquery.uniform.js"></script>
		<!-- Tipsy -->
		<script src="../Javascript/Tipsy/jquery.tipsy.js"></script>
		<!-- Elastic -->
		<script src="../Javascript/Elastic/jquery.elastic.js"></script>
		<!-- ColorPicker -->
		<script src="../Javascript/ColorPicker/colorpicker.js"></script>
		<!-- SuperTextarea -->
		<script src="../Javascript/SuperTextarea/jquery.supertextarea.min.js"></script>
		<!-- UISpinner -->
		<script src="../Javascript/UISpinner/ui.spinner.js"></script>
		<!-- MaskedInput -->
		<script src="../Javascript/MaskedInput/jquery.maskedinput-1.3.js"></script>
		<!-- ClEditor -->
		<script src="../Javascript/ClEditor/jquery.cleditor.js"></script>
		<!-- Full Calendar -->
		<script src="../Javascript/FullCalendar/fullcalendar.js"></script>
		<!-- Color Box -->
		<script src="../Javascript/ColorBox/jquery.colorbox.js"></script>
		<!-- Kanrisha Script -->
		<script src="../Javascript/kanrisha.js"></script>

		<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

	</head>

	<body>
		<div id="list_contact" class="g_12">
			<div class="widget_header wwOptions">
				<h4 class="widget_header_title wwIcon i_16_data">List Contacts</h4>
			</div>
			<div class="widget_contents noPadding">
				<div class="dataTables_wrapper">
					<div class="dtTop">
						<div class="dtShowPer">
							<div class="dataTables_length">
								<label> Show contacts:
									<div class="selector">
										<span style="-moz-user-select: none">10</span>
										<select name="DataTables_Table_0_length" size="1" style="opacity: 0;">
											<option value="10" selected="selected">10</option>
											<option value="25">25</option>
											<option value="50">50</option>
											<option value="100">100</option>
										</select>
									</div> </label>
							</div>
						</div>
						<div class="dtFilter">
							<div class="dataTables_filter">
								<div style="width: auto; margin-left: 15px; float: left;">
									First Name:
									<input class="simple_field" type="text"  style="width: 150px;"/>
								</div>

								<div style="width: auto; margin-left: 25px; float: right;">
									Surname:
									<input class="simple_field" type="text" style="width: 150px;" />
								</div>
								<div id="control_buttons" style="margin-left: 15px;">
									<input type="button" value="Search" class="simple_buttons" style="width: auto; margin-left: 15px; "/>
									<input type="button" value="Clear" class="simple_buttons" style="margin-left: 15px; width: auto;"/>
									<input type="button" value="None" class="simple_buttons" style="margin-left: 15px; "/>
									<input type="button" value="Create" class="simple_buttons" style="margin-left: 15px; "/>
								</div>
							</div>
						</div>

					</div>
					<div class="dtTables">
						<table id="DataTables_Table_0" class="tables  noObOLine dataTable" aria-describedby="DataTables_Table_0_info">
							<thead>
								<tr id="head_table">
									<td></td>
									<td>Contact Name</td>
									<td>Mobile Phone</td>
									<td>Email</td>
									<td>Contact Type</td>
									<td>Is Active?</td>
									<td> </td>
								</tr>
							</thead>
							<tbody>
								<tr>
									<td>
									<input type="radio" name="contact_row" class="simple_form" />
									</td>
									<td>Nguyen Hoang Hai</td>
									<td>0975700915</td>
									<td>hainhh1@fsoft.com.vn</td>
									<td>True</td>
									<td> </td>
									<td></td>
								</tr> 
								<tr>
									<td>
									<input type="radio" name="contact_row" class="simple_form" />
									</td>
									<td>Vu Nhu Tien</td>
									<td>0988888787</td>
									<td>tiennv@fsoft.com.vn</td>
									<td>False</td>
									<td></td>
									<td></td>
								</tr>
								<tr>
									<td>
									<input type="radio" class="simple_form" name="contact_row" class="simple_field" />
									</td>
									<td>Nguyen Dai Quang</td>
									<td>0987654634</td>
									<td>quangnd6@fsoft.com.vn</td>
									<td></td>
									<td></td>
									<td></td>
								</tr>
							</tbody>
						</table>

					</div>
					<div class="dtBottom">
						<div class="dtInfo">
							<div>
								Show 1 to 3 of 3 entries
							</div>
							<div id="control_buttons" >
								<input type="button" value="Select" class="simple_buttons" style="width: auto; margin-left: 15px; "/>
								<input type="button" value="Edit" class="simple_buttons bdC" style="margin-left: 15px; width: auto;"/>
								<input type="button" value="Close" class="simple_buttons" style="margin-left: 15px; "/>

							</div>
						</div>
						<div class="dtPagination">
							<div>
								<a>First</a>
								<a>Previous</a>
								<a>1</a>
								<a>2</a>
								<a>...</a>
								<a>10</a>
								<a>Next</a>
								<a>Last</a>
							</div>

						</div>
					</div>
				</div>
			</div>
		</div>
	</body>
</html>